
/*盒子模型*/
@each $typeKey, $type in $spaceTypes {
	@each $sizeKey, $size in $spaceSizes {
		// margin-top:10rpx
		@each $directionKey, $direction in $spaceDirections {
			.#{$typeKey}#{$directionKey}#{$sizeKey} {
				#{$type}-#{$direction}: $size;
			}
		}
		
		

		// margin: 10rpx 0;
		.#{$typeKey}x#{$sizeKey} {
			#{$type}-left: $size;
			#{$type}-right: $size;
		}
		.#{$typeKey}y#{$sizeKey} {
			#{$type}-top: $size;
			#{$type}-bottom: $size;
		}

		// margin: 10rpx ;
		.#{$typeKey}a#{$sizeKey} {
			#{$type}: $size;
		}
	}
}

.bs{
	box-sizing: border-box;
}
/*按钮禁用*/
.disabled {
	outline: 0 none;
	cursor: default !important;
	opacity: 0.4;
	filter: alpha(opacity=40);
	-ms-pointer-events: none;
	pointer-events: none;
}

/**
 * 
 * 自定义class工具
 * 
*/
.bg-cover{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.pad {
	padding: 0 30upx;
}
// 格式化页面
.page_box {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow-x: hidden;
	background: #f6f6f6;
}
.scroll-box {
	flex: 1;
	height: 100%;
	position: relative;
}
.content_box {
	flex: 1;
	overflow-y: auto;
}
/*单行文本溢出省略号*/
.one-t {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	transition: all linear 0.2s;
}
/*多行文本溢出省略号*/
.more-t {
	overflow: hidden;
	text-overflow: ellipsis;
	 word-break:break-all;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	transition: all linear 0.2s;
}

/* ==================
          flex布局(colorui里面也有相关基础样式)
 ==================== */
/* x水平排列*/
.x-f {
	display: flex;
	align-items: center;
}
/*x两端且水平居中*/
.x-bc {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
/*x平分且水平居中*/
.x-ac {
	display: flex;
	justify-content: space-around;
	align-items: center;
}
/*x水平靠上对齐*/
.x-start {
	display: flex;
	align-items: flex-start;
}
/*x水平靠下对齐*/
.x-end {
	display: flex;
	align-items: flex-end;
}
/*上下左右居中*/
.x-c {
	display: flex;
	justify-content: center;
	align-items: center;
}
/*y竖直靠左*/
.y-start {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
/*y竖直靠右*/
.y-end {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
/*y竖直居中*/
.y-f {
	display: flex;
	flex-direction: column;
	align-items: center;
}
// y竖直两端
.y-b {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
/*y竖直两端居中*/
.y-bc {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
}
// 垂直上下左右居中
.y-center{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.x-center{
	display: flex;
	align-items: center;
	justify-content: center;
}

//  flex布局
.df{
	display: flex;
}
.df-y{
	display: flex;
	flex-direction: column;
}
.df-xc{
	display: flex;
	justify-content: center;
}
.df-xb{
	display: flex;
	justify-content: space-between;
}
.df-xe{
	display: flex;
	justify-content: space-evenly;
}
.df-xa{
	display: flex;
	justify-content: space-around;
}
.ai{
	align-items: center;
}
.jc{
	justify-content: center;
}
.df-y{
	display: flex;
	flex-direction: column;
}
.df-yc{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.df-yb{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.df-ye{
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}
.df-ya{
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}
.df-c{
	display: flex;
	align-items: center;
	justify-content: center;
}

// 字体
.fb{
	font-weight: bold;
}
.fs22{
	font-size: 22rpx;
}
.fs24{
	font-size: 24rpx;
}
.fs26{
	font-size: 26rpx;
}
.fs26{
	font-size: 26rpx;
}
.fs28{
	font-size: 28rpx;
}
.fs30{
	font-size: 30rpx;
}
.fs32{
	font-size: 32rpx;
}
.fs34{
	font-size: 34rpx;
}
.fs36{
	font-size: 36rpx;
}

.highlight{
	 color: #D18C42;
}
.titleColor{
	color: #622129;
}
.lightColor{
	color: #666C73;
}
.white{
	color: #FFFFFF;
}
.shsc{
	font-family: shsc,'PingFangSC-Thin', 'PingFangSC';
}
// 盒子模型

.bs{
	box-sizing: border-box;
}

.wh100{
	width: 100%;
	height: 100%;
}
.w100{
	width: 100%;
}
.h100{
	height: 100%;
}

.vw{
	width: 100vw;
}
.vh{
	height: 100vh;
}
.vwh{
	width: 100vw;
	height: 100vh;
}

// item分割线

.bb{
	border-bottom: 1rpx solid rgba($color: #000000, $alpha: 0.05);
}

// 定位居中
.ab-c{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}
.ab-xc{
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}
.ab-yc{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
.re-c{
	position: relative;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}

.fixed-c{
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}

// 圆角
.br-10{
	border-radius: 10rpx;
}
.br-20{
	border-radius: 20rpx;
}
.br-15{
	border-radius: 15rpx;
}
.br-12{
	border-radius: 12rpx;
}
.br-30{
	border-radius: 30rpx;
}
.br-cir{
	border-radius: 50%;
}
// 背景图片

.bg-c{
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}